<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<link rel="stylesheet" type="text/css" href="../../_third-party/bootstrap/bootstrap.css" />
		<link rel="stylesheet" type="text/css" href="../../_src/wm-custom.css" />
		<link rel="stylesheet" type="text/css" href="../../_src/navigation/steps.css" />
		<title></title>
	</head>
	<body>
		<h3>1、步骤条</h3>
		<hr>
		<div class="wm-steps">
			<div class="wm-steps-default pull-left mr15">
				<div class="wm-steps-icon">
					<span class="wm-steps-success glyphicon glyphicon-ok" aria-hidden="true"></span>
					<span class="wm-font-text ml5 wm-steps-text">已完成</span>
				</div>
				<div class="wm-steps-line"></div>
			</div>
			<div class="wm-steps-default pull-left mr15 clearfix">
				<div class="wm-steps-icon">
					<span class="wm-steps-proceed">2</span>
					<span class="wm-font-text ml5 wm-steps-text wm-text-bold">进行中</span>
				</div>
				<div class="wm-steps-line2"></div>
			</div>
			<div class="wm-steps-default pull-left">
				<div class="wm-steps-icon">
					<span class="wm-steps-nosuccess">3</span>
					<span class="wm-font-disabled ml5 wm-steps-text">未完成</span>
				</div>
			</div>
		</div>
		<h3>2、带描述步骤条</h3>
		<hr>
		<div class="wm-steps2">
			<div class="wm-steps-default pull-left mr15">
				<div class="wm-steps-icon">
					<span class="wm-steps-proceed">1</span>
					<span class="wm-font-text ml5 wm-text-bold wm-text-16">步骤一</span>
					<div class="wm-steps-line2 pull-right"></div>
				</div>

				<div class="wm-steps-p wm-font-disabled wm-two-apostrophe">处理描述有点多有点多不得不换行</div>
			</div>
			<div class="wm-steps-default pull-left mr15">
				<div class="wm-steps-icon">
					<span class="wm-steps-nosuccess">2</span>
					<span class="ml5 wm-steps-text wm-text-16">步骤二</span>
					<div class="wm-steps-line2 pull-right"></div>
				</div>
				<div class="wm-steps-p wm-font-disabled wm-two-apostrophe">处理描述有点多有点多不得不换行</div>
			</div>
			<div class="wm-steps-default pull-left">
				<div class="wm-steps-icon">
					<span class="wm-steps-nosuccess">3</span>
					<span class="ml5 wm-steps-text wm-text-16">步骤三</span>
				</div>
				<div class="wm-steps-p wm-font-disabled wm-two-apostrophe">处理描述有点多有点多不得不换行。</div>
			</div>
		</div>
		<h3>3、竖向步骤条</h3>
		<hr>
		<div class="wm-steps3">
			<div class="wm-steps-default mr15">
				<div class="wm-steps-icon">
					<span class="wm-steps-success glyphicon glyphicon-ok" aria-hidden="true"></span>
					<span class="wm-font-text ml5 wm-steps-text">已完成</span>
				</div>
				<div class="wm-steps-line"></div>
			</div>
			<div class="wm-steps-default mr15 clearfix">
				<div class="wm-steps-icon">
					<span class="wm-steps-proceed">2</span>
					<span class="wm-font-text ml5 wm-steps-text wm-text-bold">进行中</span>
				</div>
				<div class="wm-steps-line2"></div>
			</div>
			<div class="wm-steps-default">
				<div class="wm-steps-icon">
					<span class="wm-steps-nosuccess">3</span>
					<span class="wm-font-disabled ml5 wm-steps-text">未完成</span>
				</div>
			</div>
		</div>

		<h3>4、带时间人员步骤条</h3>
		<hr>
		<div class="wm-steps4">
			<div class="wm-steps-default pull-left">
				<div class="wm-steps-icon">
					<div class="wm-text-dot">
						<span><i class="samllprimary"></i>
							<div class="wm-steps-line pull-right"></div>
						</span>
					</div>

				</div>
				<span class="wm-font-text wm-steps-text wm-text-16">创建项目</span>
				<div class="wm-steps-p wm-font-disabled mt15">曲丽丽(图标)</div>
				<div class="wm-steps-p wm-font-disabled">2017-10-01 12:00</div>
			</div>
			<div class="wm-steps-default pull-left">
				<div class="wm-steps-icon">
					<div class="wm-text-dot">
						<span><i class="primary"></i>
							<div class="wm-steps-line2 pull-right"></div>
						</span>
					</div>
				</div>
				<span class="wm-font-text wm-steps-text wm-text-bold wm-text-16">部门初审</span>
				<div class="wm-steps-p wm-font-disabled mt15">曲丽丽(图标)</div>
				<div class="wm-steps-p wm-font-disabled text-primary">催一下</div>
			</div>
			<div class="wm-steps-default pull-left">
				<div class="wm-steps-icon">
					<div class="wm-text-dot">
						<span><i class="default"></i>
							<div class="wm-steps-line2 pull-right"></div>
						</span>
					</div>
				</div>
				<span class="wm-steps-p wm-font-text wm-text-16">财务复审</span>
			</div>
			<div class="wm-steps-default pull-left">
				<div class="wm-steps-icon">
					<div class="wm-text-dot">
						<span><i class="default"></i></span>
					</div>
				</div>
				<span class="wm-steps-p wm-font-text wm-text-16">完成</span>
			</div>
		</div>
	</body>
</html>
